;(function($){
	const Carousel = function(poster){
			const self = this;
			this.poster         = poster;
			this.posterItemMain = poster.find("ul.poster-list");
			this.nextBtn        = poster.find("div.poster-next-btn");
			this.prevBtn        = poster.find("div.poster-prev-btn");
			this.posterItems    = poster.find("li.poster-item");
			// // 图片个数为奇数时左右对称，图片素材最好为奇数
		    // const posternum =  this.posterItems.size();
		    // let   randomnum = parseInt(Math.random()*(posternum-2)+1);
		    //  if(this.posterItems.size()%2==0){
			// 		this.posterItemMain.append(this.posterItems.eq(randomnum).clone());
			// 		this.posterItems = this.posterItemMain.children();
			// 	};
			this.posterFirstItem  = $("li.poster-item").first();
			this.posterLastItem  = $("li.poster-item").last();
			this.rotateFlag   = true;
			this.setting = {
				"width":1000,
				"height":270,
				"posterWidth":640,
				"posterHeight":270,
				"scale":0.9,
				"speed":5000,
				"autoPlay":false,
				"delay":5000,
				"verticalAlign":"middle"
			};
			$.extend(this.setting,this.getSetting());
			this.setSettingValue();
			this.setPosterPos();
			//左旋转按钮
			this.nextBtn.click(function(){
				if(self.rotateFlag){
					self.rotateFlag = false;
					self.carouseRotate("left");
				};
			});
			//右旋转按钮
			this.prevBtn.click(function(){
				if(self.rotateFlag){
					self.rotateFlag = false;
					self.carouseRotate("right");
				};
			});
			是否开启自动播放
			if(this.setting.autoPlay){
				this.autoPlay();
				this.poster.hover(function(){
					window.clearInterval(self.timer);
					},function(){
					self.autoPlay();
					});
				};
		};
	Carousel.prototype = {
		autoPlay:function(){
			const self = this;
			this.timer = window.setInterval(function(){
				self.nextBtn.click();
			},this.setting.delay);
		},
		//旋转
		carouseRotate:function(dir){
			const _this_  = this;
			let zIndexArr = [];
			//左旋转
			if(dir === "left"){
				$("li.poster-item").each(function(){
					let self = $(this),
						//若取到postItem[0]执行self.prev()的返回值，否则执行_this_.posterLastItem
						   prev = self.prev().get(0) ? self.prev() : _this_.posterLastItem,
						   width = prev.width(),
						   height =prev.height(),
						   zIndex = prev.css("zIndex"),
						   opacity = prev.css("opacity"),
						   left = prev.css("left"),
						   top = prev.css("top");
							zIndexArr.push(zIndex);
						   self.animate({
							   	width:width,
								height:height,
								opacity:opacity,
								left:left,
								top:top
								},
							_this_.setting.speed,function(){
								_this_.rotateFlag = true;
							});
				});
				$("li.poster-item").each(function(i){
					$(this).css("zIndex",zIndexArr[i]);
				});
			}
			//右旋转
			else if(dir === "right"){
				$("li.poster-item").each(function(){
					let self = $(this),
						   next = self.next().get(0)?self.next():_this_.posterFirstItem,
						   width = next.width(),
						   height =next.height(),
						   zIndex = next.css("zIndex"),
						   opacity = next.css("opacity"),
						   left = next.css("left"),
						   top = next.css("top");
						   zIndexArr.push(zIndex);
						   self.animate({
							width:width,
							height:height,
							opacity:opacity,
							left:left,
							top:top
							},
							_this_.setting.speed, function(){
								_this_.rotateFlag = true;
					});
				});
				$("li.poster-item").each(function(i){
					$(this).css("zIndex",zIndexArr[i]);
				});
			}
		},
		//设置剩余的帧的位置关系
		setPosterPos:function(){
				const   self = this;
				//此处获取除第一帧以外的所有帧
				let	sliceItems  = $("li.poster-item").slice(1),
				sliceSize     = sliceItems.size()/2,
				//分割左右切片
				rightSlice   = sliceItems.slice(0,sliceSize),
				level         = Math.floor($("li.poster-item").size()/2),
				leftSlice      =sliceItems.slice(sliceSize);
				//设置左边位置关系
				let rw = this.setting.posterWidth,
					rh  = this.setting.posterHeight,
					gap = ((this.setting.width-this.setting.posterWidth)/2)/level;
					let firstLeft = (this.setting.width-this.setting.posterWidth)/2;
					let fixOffsetLeft = firstLeft+rw;
				    rightSlice.each(function(i){
					level--;
					rw = rw *self.setting.scale;
					rh = rh *self.setting.scale;
					let j = i;
					$(this).css({
						zIndex:level,
						width:rw,
						height:rh,
						opacity:1/(++j),
						left:fixOffsetLeft+(++i)*gap-rw,
						top:self.setVerticalAlign(rh)
					});
				});
				//设置右边的位置关系
				let lw = rightSlice.last().width(),
					lh  =rightSlice.last().height(),
					oloop = Math.floor($("li.poster-item").size()/2);
				leftSlice.each(function(i){
					$(this).css({
						zIndex:i,
						width:lw,
						height:lh,
						opacity:1/oloop,
						left:i*gap,
						top:self.setVerticalAlign(lh)
					});
					lw = lw/self.setting.scale;
					lh = lh/self.setting.scale;
					oloop--;
				});
		},

		//设置垂直排列对齐
		setVerticalAlign:function(height){
			let verticalType  = this.setting.verticalAlign,
					top = 0;
			if(verticalType === "middle"){
				top = (this.setting.height-height)/2;
			}else if(verticalType === "top"){
				top = 0;
			}else if(verticalType === "bottom"){
				top = this.setting.height-height;
			}else{
				top = (this.setting.height-height)/2;
			};
			return top;
		},

		//设置配置参数值去控制基本的宽度高度。。。
		setSettingValue:function(){
			this.poster.css({
				width:this.setting.width,
				height:this.setting.height
			});
			this.posterItemMain.css({
				width:this.setting.width,
				height:this.setting.height
			});
			//计算上下切换按钮的宽度
			const w = (this.setting.width-this.setting.posterWidth)/2;
			this.nextBtn.css({
				width:w,
				height:this.setting.height,
				zIndex:100000
			});
			this.prevBtn.css({
				width:w,
				height:this.setting.height,
				zIndex:100000
			});
			this.posterFirstItem.css({
				width:this.setting.posterWidth,
				height:this.setting.posterHeight,
				left:w,
				top:0,
				zIndex:Math.floor($("li.poster-item").size()/2)
			});
		},
		getSetting:function(){
			let setting = this.poster.attr("data-setting");
			if(setting&&setting!=""){
				return $.parseJSON(setting);
			}else{
				return {};
			};
		}
	};
	Carousel.init = function(posters){
		let _this_ = this;
		posters.each(function(){
			new  _this_($(this));
		});
	};
	window["Carousel"] = Carousel;
})(jQuery);
